<template>
	<navigatorComp title="祠堂设置" bgcColor="#1E201F" fontColor="#fff"></navigatorComp>

	<view class="content">
		<view class="settingBox">
			<view class="box">
				<view class="settingWrap">
					<view class="title">祠堂资料</view>
					<view class="setting">
						<view class="settingItem" @click="goEditInfo">
							<image src="http://112.124.50.179:8888/imgs/home/setting1.png" mode=""></image>
							<view>基本信息</view>
						</view>
						<view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/memoir')">
							<image src="http://112.124.50.179:8888/imgs/home/setting2.png" mode=""></image>
							<view>传记</view>
						</view>
						<view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/ancestralTempleAlbum')">
							<image src="http://112.124.50.179:8888/imgs/home/setting3.png" mode=""></image>
							<view>回忆相册</view>
						</view>
						<view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/ancestralTempleVideo')">
							<image src="http://112.124.50.179:8888/imgs/home/setting4.png" mode=""></image>
							<view>纪念视频</view>
						</view>
						<view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/position')">
							<image src="http://112.124.50.179:8888/imgs/home/setting5.png" mode=""></image>
							<view>真实祠堂</view>
						</view>
						<!-- <view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/brief_introduction')">
							<image src="http://112.124.50.179:8888/imgs/home/temple_func1.png" mode=""></image>
							<view>祠堂简介</view>
						</view> -->
					</view>
				</view>
				<view class="settingWrap" style="margin-top: 60rpx">
					<view class="title">祠堂设置</view>
					<view class="setting">
						<view class="settingItem" @click="goUrl('/subPages/home/ancestralTemple/memorial_tablet')">
							<image src="http://112.124.50.179:8888/imgs/home/temple_func2.png" mode=""></image>
							<view>牌位管理</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		ref,
		reactive
	} from 'vue';
	import navigatorComp from '/components/navigator/index.vue'

	/**
	 * 编辑基本信息
	 */
	const goEditInfo = () => {
		uni.navigateTo({
			url: '/subPages/home/ancestralTemple/create_temple?isEdit=1'
		})
	}

	const goUrl = (url) => {
		uni.navigateTo({
			url: url
		});
	};
</script>

<style lang="scss">
	page {
		background-color: #1e201f;
		/* #ifdef H5 */
		padding-top: 0;
		/* #endif */
	}

	.content {
		// padding: 0;
	}

	.border {
		width: 100%;
		height: 100%;
		background: linear-gradient(180deg, #292b2a 0%, #8a918e 100%);
		border-radius: 14rpx;
		padding: 64rpx;
		box-sizing: border-box;
	}

	.settingBox {
		margin-top: 32rpx;
		overflow: hidden;
		width: 100%;
		height: 708rpx;
		box-sizing: border-box;
		padding: 1px;
		border-radius: 14px;
		background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100%);
	}

	.box {
		width: 100%;
		height: 100%;
	border-radius: 14px;
	background: linear-gradient(180deg, rgba(33, 36, 34, 1) 0%, rgba(89, 95, 91, 1) 100%);
		padding: 64rpx;
		box-sizing: border-box;
	}

	.settingWrap {
		.title {
			font-weight: 400;
			font-size: 32rpx;
			color: #ffffff;
			line-height: 32rpx;
			margin-bottom: 48rpx;
		}

		.setting {
			display: flex;
			flex-wrap: wrap;
			font-weight: 400;
			font-size: 28rpx;
			color: #ffffff;
			line-height: 28rpx;
			margin-right: -128rpx;

			.settingItem {
				margin-right: 128rpx;
				display: flex;
				align-items: center;
				margin-bottom: 40rpx;
			}
		}

		image {
			width: 40rpx;
			height: 40rpx;
			margin-right: 24rpx;
		}
	}
</style>